<template>
    <Modal v-model="show" @on-cancel="cancel" :closable="false">
        <Tabs :value="tabIndex" class="config">
            <TabPane label="基本配置" :name="tabs[0]">
                <Form ref="ipcForm" :model="ipcInfo" :label-width="75" label-position="right"
                      :rules="ipcRules">
                    <FormItem label="IPC ID" prop="ipc_id">
                        <Input v-model.trim="ipcInfo.ipc_id" placeholder="请填写IPC ID" :disabled="edit_flag"/>
                    </FormItem>
                    <FormItem label="IPC名称" prop="ipc_name">
                        <Input v-model.trim="ipcInfo.ipc_name" placeholder="请填写IPC名称"/>
                    </FormItem>
                </Form>
                <Form ref="rtspForm" :model="ipcInfo.ipc_rtsp_config" :label-width="75" label-position="right"
                      :rules="rtspRules">
                    <FormItem label="IP地址" prop="ip">
                        <Input v-model="ipcInfo.ipc_rtsp_config.ip" placeholder="请填写地址"/>
                    </FormItem>
                    <FormItem label="端口号" prop="port">
                        <InputNumber v-model.trim="ipcInfo.ipc_rtsp_config.port" placeholder="端口号"
                                     style="width: 100%;"></InputNumber>
                    </FormItem>
                    <FormItem label="用户名" prop="account">
                        <Input v-model.trim="ipcInfo.ipc_rtsp_config.account" placeholder="请填写用户名"/>
                    </FormItem>
                    <FormItem label="密码" prop="password">
                        <Input v-model.trim="ipcInfo.ipc_rtsp_config.password" placeholder="请填写密码" type="password"/>
                    </FormItem>
                    <FormItem label="subtype" prop="subtype">
                        <Select v-model="ipcInfo.ipc_rtsp_config.subtype">
                            <Option value=0>主码流</Option>
                            <Option value=1>辅码流</Option>
                            <Option value=2>辅码流2</Option>
                        </Select>
                    </FormItem>
                    <FormItem label="channel" prop="channel">
                        <InputNumber v-model="ipcInfo.ipc_rtsp_config.channel" placeholder="通道号"></InputNumber>
                    </FormItem>
                </Form>
            </TabPane>
            <TabPane label="SDK配置" :name="tabs[1]" style="padding: 10px">
                <Form ref="sdkForm" :model="ipcInfo.ipc_capture_config.content.SdkConfig.source_config"
                      label-position="top"
                      :rules="sdkRules">
                    <FormItem label="视频流输入图像宽" prop="width">
                        <InputNumber v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.width"/>
                    </FormItem>
                    <FormItem label="视频流输入图像高" prop="height">
                        <InputNumber v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.height"/>
                    </FormItem>
                </Form>
                <Form ref="cloudForm" :model="ipcInfo.ipc_capture_config.content.cloud_service" label-position="top"
                      :rules="cloudRules">
                    <FormItem label="识别服务器地址" prop="base_url">
                        <Input v-model.trim="ipcInfo.ipc_capture_config.content.cloud_service.base_url"/>
                    </FormItem>
                    <FormItem label="识别服务接口名" prop="face_recog_api">
                        <Input v-model.trim="ipcInfo.ipc_capture_config.content.cloud_service.face_recog_api"/>
                    </FormItem>
                    <FormItem label="ca path" prop="ca_path">
                        <Input v-model.trim="ipcInfo.ipc_capture_config.content.cloud_service.ca_path"/>
                    </FormItem>
                </Form>
            </TabPane>
            <TabPane label="人脸过滤设置" :name="tabs[2]" style="padding: 10px">
                <Form ref="filterForm" :model="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter"
                      label-position="top"
                      :rules="filterRules">
                    <FormItem label="正脸阈值设置，值越高正脸概率越大" prop="pose_low">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.pose_low"></InputNumber>
                    </FormItem>
                    <FormItem label="模糊阈值设置，值越高图像质量越好" prop="blur_low">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.blur_low"></InputNumber>
                    </FormItem>
                    <FormItem label="人脸框宽度阈值，大于此值才会抓拍" prop="width_low">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.width_low"></InputNumber>
                    </FormItem>
                    <FormItem label="人脸框高度阈值，大于此值才会抓拍" prop="height_low">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.height_low"></InputNumber>
                    </FormItem>
                    <FormItem label="人脸框距离视频左右边缘大于此值才会抓拍" prop="width_bound_thr">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.width_bound_thr"></InputNumber>
                    </FormItem>
                    <FormItem label="人脸框距离视频上下边缘大于此值才会抓拍" prop="height_bound_thr">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter.height_bound_thr"></InputNumber>
                    </FormItem>
                </Form>
            </TabPane>
            <TabPane label="人脸抓拍设置" :name="tabs[3]" style="padding: 10px">
                <Form ref="snapForm" :model="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap"
                      label-position="top"
                      :rules="snapRules">
                    <FormItem label="获取抓拍访问接口" prop="port">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap.port"></InputNumber>
                    </FormItem>
                    <FormItem label="抓拍模式，1是针对非智能IPC设置的，目前只能设置为1" prop="snapshot_mode">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap.snapshot_mode"
                                disabled></InputNumber>
                    </FormItem>
                    <FormItem label="值为50为例，则50帧后就会重新再抓拍一次并识别上传" prop="max_track_frame_num">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap.max_track_frame_num"></InputNumber>
                    </FormItem>
                    <FormItem label="相同track id在100帧内没有再次出现的话，则清理该track id相关历史记录" prop="track_timeout">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap.track_timeout"></InputNumber>
                    </FormItem>
                    <FormItem label="抓拍优选张数" prop="report_thresh">
                        <InputNumber
                                v-model.trim="ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_snap.report_thresh"></InputNumber>
                    </FormItem>
                </Form>
            </TabPane>
        </Tabs>
        <div slot="footer">
            <Button type="text" size="large" @click="show = false">取消</Button>
            <Button type="primary" @click="handleSubmit">提交</Button>
        </div>
    </Modal>
</template>

<script>

    import Tool from '@/libs/util'
    import ME from '../../../controllers/ipcSetting'

    export default {
        name: "add-ipc-modal-dahua",
        props: {
            title: {
                type: String,
                default: "视频流_大华"
            },
            update_callback: {
                type: Function,
                default() {

                }
            }
        },
        created() {
            this.ipcInfo = Tool.deepCopy(this.defaultInfo)
        },
        data() {
            return {
                ipcInfo: {},
                defaultInfo: {
                    ipc_id: "",
                    ipc_name: "",
                    ipc_type: "DahuaNormal",
                    ipc_rtsp_config: {
                        ip: "",
                        port: 554,
                        account: "",
                        password: "",
                        subtype: 2,
                        channel: 1,
                    },
                    ipc_capture_config: {
                        target: 'ipc',
                        content: {
                            name: "test",// 外层的id
                            IpcConfig: {
                                ipc_type: "DahuaNormal",
                                dh_info: {
                                    ip: "",
                                    port: 554,
                                    username: "",
                                    password: ""
                                },
                            },
                            cloud_service: {
                                base_url: "http://localhost:8078",
                                face_recog_api: "feature_face",
                                ca_path: "assets/face_snapshot/certificate/server.crt",
                            },
                            SdkConfig: {
                                source_config: {
                                    width: 1920,
                                    height: 1080,
                                    face_filter: {
                                        pose_low: 60000,
                                        pose_high: 64000,
                                        blur_low: 60000,
                                        blur_high: 62000,
                                        width_low: 26,
                                        width_high: 50,
                                        height_low: 30,
                                        height_high: 72,
                                        width_bound_thr: 20,
                                        height_bound_thr: 20
                                    },
                                    face_snap: {
                                        port:37777,
                                        snapshot_mode: 1,
                                        max_track_frame_num: 50,
                                        track_timeout: 100,
                                        report_thresh: 3
                                    }
                                }
                            }
                        }
                    }
                },
                ipcRules: {
                    ipc_id: [{required: true, message: '请检查', trigger: 'change'}],
                    ipc_name: [{required: true, message: '请检查', trigger: 'change'}],
                },
                rtspRules: {
                    ip: [
                        {required: true, message: '请检查', trigger: 'change'},
                        {
                            pattern: /^((25[0-5]|2[0-4]\d|[01]?\d\d?).){3}(25[0-5]|2[0-4]\d|[01]?\d\d?)$/,
                            message: 'IP不正确',
                            trigger: 'blur'
                        }
                    ],
                    port: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    channel: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    subtype: [{required: true, message: '请检查', trigger: 'change'}],
                    account: [{required: true, message: '请检查', trigger: 'change'}],
                    password: [{required: true, message: '请检查', trigger: 'change'}],
                },
                sdkRules: {
                    width: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    height: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                },
                cloudRules: {
                    base_url: [{required: true, message: '请检查', trigger: 'change'}],
                    face_recog_api: [{required: true, message: '请检查', trigger: 'change'}],
                    ca_path: [{required: true, message: '请检查', trigger: 'change'}],
                },
                filterRules: {
                    pose_low: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    blur_low: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    width_low: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    height_low: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    width_bound_thr: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    height_bound_thr: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                },
                snapRules: {
                    port: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    snapshot_mode: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    max_track_frame_num: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    track_timeout: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                    report_thresh: [{required: true, type: "number", message: '请检查', trigger: 'change'}],
                },
                show: false,
                edit_flag: false,
                tabIndex: "setting1",
                tabs: ["tab1", "tab2", "tab3", "tab4"]
            }
        },
        methods: {
            /**
             * 依次验证4个表格，都通过的时候进行提交
             */
            handleSubmit() {
                let convertTable = [0, 0, 1, 1, 2, 3]
                Promise.all([
                    this.$refs['ipcForm'].validate(),//0
                    this.$refs['rtspForm'].validate(),//0
                    this.$refs['sdkForm'].validate(),//1
                    this.$refs['cloudForm'].validate(),//1
                    this.$refs['filterForm'].validate(),//2
                    this.$refs['snapForm'].validate(),//3
                ]).then(res => {
                    for (let index in res) {
                        if (!res[index]) {
                            this.tabIndex = this.tabs[convertTable[index]]
                            this.$Message.error("请检查表单")
                            return
                        }
                    }
                    this.submit()
                })
            },
            submit() {
                let filterInfo = this.ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter
                this.ipcInfo.ipc_capture_config.content.SdkConfig.source_config.face_filter = {
                    pose_low: filterInfo.pose_low,
                    pose_high: filterInfo.pose_low,
                    blur_low: filterInfo.blur_low,
                    blur_high: filterInfo.blur_low,
                    width_low: filterInfo.width_low,
                    width_high: filterInfo.width_low,
                    height_low: filterInfo.height_low,
                    height_high: filterInfo.height_low,
                    width_bound_thr: filterInfo.width_bound_thr,
                    height_bound_thr: filterInfo.height_bound_thr
                }
                this.ipcInfo.ipc_capture_config.content.IpcConfig.dh_info = {
                    ip: this.ipcInfo.ipc_rtsp_config.ip,
                    port: this.ipcInfo.ipc_rtsp_config.port,
                    username: this.ipcInfo.ipc_rtsp_config.account,
                    password: this.ipcInfo.ipc_rtsp_config.password
                }
                this.ipcInfo.ipc_capture_config.content.name = this.ipcInfo.ipc_id

                ME.addOrUpdateIpc(this.edit_flag, this.ipcInfo).then(json => {
                    if (json.code == 0) {
                        this.$Message.success(this.edit_flag ? "更新成功" : "添加成功")
                        this.show = false
                        this.update_callback()
                    }
                })
            },
            cancel() {
                this.tabIndex = this.tabs[0]
                this.$refs['ipcForm'].resetFields()
                this.$refs['rtspForm'].resetFields()
                this.$refs['sdkForm'].resetFields()
                this.$refs['cloudForm'].resetFields()
                this.$refs['filterForm'].resetFields()
                this.$refs['snapForm'].resetFields()
            },
            showAsUpdate(data) {
                this.ipcInfo = Tool.deepCopy(data)
                if (!this.ipcInfo.ipc_capture_config) {
                    this.ipcInfo.ipc_capture_config = Tool.deepCopy(this.defaultInfo.ipc_capture_config)
                }
                this.show = true
                this.edit_flag = true
            },
            showAsAdd() {
                this.ipcInfo = Tool.deepCopy(this.defaultInfo)
                this.show = true
                this.edit_flag = false
            }
        },

    }
</script>

<style scoped>
    .config {

    }

    .config input {
        width: 100%;
    }

    .config div {
        width: 100%;
    }
</style>